.metro {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro div {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro li {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro div::after {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro .carat {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro .carat::after {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro .selected::after {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro::after {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.metro .selected::after {
	pointer-events: none; -webkit-pointer-events: none; -moz-pointer-events: none; -ms-pointer-events: none;
}
.metro.scrollable div::after {
	pointer-events: none; -webkit-pointer-events: none; -moz-pointer-events: none; -ms-pointer-events: none;
}
.metro {
	background: rgb(248, 248, 248); border: 1px solid rgb(216, 216, 216); border-image: none; width: 36%; font-weight: 200; margin-right: 7px; margin-bottom: 10px; float: left; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none;
}
.metro_width {
	width: 90% !important;
}
.metro.open {
	z-index: 9999;
}
.metro:hover {
	background: rgb(244, 244, 244);
}
.metro::after {
	background: none; top: 2px; width: 30px; right: 3px; bottom: 3px; position: absolute; content: "";
}
.metro.focus::after {
	background: rgb(1, 128, 209);
}
.metro .carat {
	border-width: 8px; border-style: solid; border-color: rgb(0, 0, 0) transparent transparent; transform-origin: 50% 20%; border-image: none; top: 50%; right: 10px; margin-top: -4px; position: absolute; z-index: 9999; content: ""; -webkit-transform-origin: 50% 20%; -moz-transform-origin: 50% 20%;
}
.metro .carat::after {
	border-width: 8px; border-style: solid; border-color: rgb(0, 0, 0) transparent transparent; transform-origin: 50% 20%; border-image: none; top: 50%; right: 10px; margin-top: -4px; position: absolute; z-index: 9999; content: ""; -webkit-transform-origin: 50% 20%; -moz-transform-origin: 50% 20%;
}
.metro .carat::after {
	right: -8px; margin-top: -10px; border-top-color: rgb(248, 248, 248);
}
.metro:hover .carat::after {
	border-top-color: rgb(244, 244, 244);
}
.metro.focus .carat {
	border-top-color: rgb(248, 248, 248);
}
.metro.focus .carat::after {
	border-top-color: rgb(1, 128, 209);
}
.metro.open .carat {
	transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg);
}
.metro .old {
	left: 0px; top: 0px; width: 0px; height: 0px; overflow: hidden; position: absolute;
}
.metro select {
	left: 0px; top: 0px; position: absolute;
}
.metro.touch select {
	left: 0px; top: 0px; width: 100%; height: 100%; opacity: 0;
}
.metro .selected {
	background: rgb(255, 255, 255); padding: 12px; color: rgb(164, 163, 163); line-height: 1; overflow: hidden; font-size: 13px; display: block; white-space: nowrap;
}
.metro li {
	background: rgb(255, 255, 255); padding: 12px; color: rgb(164, 163, 163); line-height: 1; overflow: hidden; font-size: 13px; display: block; white-space: nowrap;
}
.metro .selected::after {
	border-radius: 0px 2px 2px 0px; top: 0px; width: 60px; right: 0px; bottom: 0px; position: absolute; content: ""; box-shadow: inset -55px 0px 25px -20px #f8f8f8;
}
.metro:hover .selected::after {
	box-shadow: inset -55px 0px 25px -20px #f4f4f4;
}
.metro div {
	background: rgb(248, 248, 248); left: 0px; top: 100%; height: 0px; right: 0px; overflow: hidden; margin-top: -1px; position: absolute; opacity: 0;
}
.metro:hover div {
	background: rgb(244, 244, 244);
}
.metro.open div {
	height: 140px !important; overflow: auto; z-index: 9999; -ms-overflow-x: hidden; opacity: 1;
}
.metro.scrollable div::after {
	left: 0px; height: 50px; right: 0px; bottom: 0px; position: absolute; content: ""; box-shadow: inset 0px -50px 30px -35px #f8f8f8;
}
.metro.scrollable:hover div::after {
	box-shadow: inset 0px -50px 30px -35px #f4f4f4;
}
.metro.scrollable.bottom div::after {
	opacity: 0;
}
.metro ul {
	list-style: none; left: 0px; top: 0px; width: 100%; height: 140px; position: absolute; z-index: 999999;
}
.metro.scrollable.open ul {
	-ms-overflow-y: auto;
}
.metro li {
	list-style: none; padding: 8px 12px; width: 100%;
}
.metro li.focus {
	background: rgb(1, 128, 209); color: rgb(255, 255, 255); position: relative; z-index: 9999;
}
.metro li.active {
	background: rgb(1, 128, 209); color: rgb(255, 255, 255);
}
.dropdown {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.dropdown div {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.dropdown li {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.dropdown div::after {
	transition:150ms ease-in-out; -webkit-transition: all 150ms ease-in-out; -moz-transition: all 150ms ease-in-out;
}
.dropdown .selected::after {
	pointer-events: none; -webkit-pointer-events: none; -moz-pointer-events: none; -ms-pointer-events: none;
}
.dropdown.scrollable div::after {
	pointer-events: none; -webkit-pointer-events: none; -moz-pointer-events: none; -ms-pointer-events: none;
}
.dropdown {
	background: rgb(255, 255, 255); border-radius: 3px; border: 1px solid rgb(204, 204, 204); border-image: none; width: 160px; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none;
}
.dropdown.open {
	z-index: 9999;
}
.dropdown:hover {
	box-shadow: 0px 0px 5px rgba(0,0,0,0.15);
}
.dropdown.focus {
	box-shadow: 0px 0px 5px rgba(51,102,248,0.4);
}
.dropdown .carat {
	border-width: 8px 6px 6px; border-style: solid; border-color: rgb(0, 0, 0) transparent transparent; border-image: none; top: 50%; right: 12px; margin-top: -4px; position: absolute;
}
.dropdown.open .carat {
	margin-top: -10px; border-top-color: transparent; border-bottom-color: rgb(0, 0, 0); border-top-width: 6px; border-bottom-width: 8px; border-top-style: solid; border-bottom-style: solid;
}
.dropdown.disabled .carat {
	border-top-color: rgb(153, 153, 153);
}
.dropdown .old {
	left: 0px; top: 0px; width: 0px; height: 0px; overflow: hidden; position: absolute;
}
.dropdown select {
	left: 0px; top: 0px; position: absolute;
}
.dropdown.touch .old {
	width: 100%; height: 100%;
}
.dropdown.touch select {
	width: 100%; height: 100%; opacity: 0;
}
.dropdown .selected {
	padding: 9px 12px; color: rgb(0, 0, 0); line-height: 1; overflow: hidden; font-size: 18px; display: block; white-space: nowrap;
}
.dropdown li {
	padding: 9px 12px; color: rgb(0, 0, 0); line-height: 1; overflow: hidden; font-size: 18px; display: block; white-space: nowrap;
}
.dropdown.disabled .selected {
	color: rgb(153, 153, 153);
}
.dropdown .selected::after {
	border-radius: 0px 2px 2px 0px; top: 0px; width: 60px; right: 0px; bottom: 0px; position: absolute; content: ""; box-shadow: inset -55px 0px 25px -20px #fff;
}
.dropdown div {
	background: rgb(255, 255, 255); border-width: 1px; border-style: solid; border-color: rgb(238, 238, 238) rgb(204, 204, 204) rgb(204, 204, 204); border-radius: 0px 0px 3px 3px; border-image: none; left: -1px; top: 100%; height: 0px; right: -1px; overflow: hidden; margin-top: -1px; position: absolute; opacity: 0;
}
.dropdown.open div {
	z-index: 9999; opacity: 1;
}
.dropdown.scrollable div::after {
	left: 0px; height: 50px; right: 0px; bottom: 0px; position: absolute; content: ""; box-shadow: inset 0px -50px 30px -35px #fff;
}
.dropdown.scrollable.bottom div::after {
	opacity: 0;
}
.dropdown ul {
	list-style: none; left: 0px; top: 0px; width: 100%; height: 100%; overflow: hidden; position: absolute;
}
.dropdown.scrollable.open ul {
	-ms-overflow-y: auto;
}
.dropdown li {
	list-style: none; padding: 8px 12px;
}
.dropdown li.focus {
	background: rgb(210, 74, 103); color: rgb(255, 255, 255); position: relative; z-index: 9999;
}
.dropdown li.active {
	font-weight: 700;
}
@media not all
{
.metro {
	width: 23%;
}
}